import { useStyle } from '@ant-design/pro-components';
import React from 'react';
import { GlobalHeaderRightProps } from '@/components/RightContent/AvatarDropdown';
import { createStyles } from 'antd-style';


const useStyles = createStyles(({ token }) => {
    return {
        wrapper: {
            display: 'flex',
            height: '40px',
            minWidth: '40px',
            marginLeft: 'auto',
            // overflow: 'hidden',
            alignItems: 'center',
            justifyContent: 'center',
            margin: '8px 0',
            padding: 4,
            cursor: 'pointer',
            borderRadius: token.borderRadius,
            '&:hover': {
                backgroundColor: token.colorBgTextHover,
            },
        },
    };
});

export const Wrapper: React.FC<GlobalHeaderRightProps> = ({children}) => {

    const {styles} = useStyles();

    return (
        <div className={styles.wrapper}>
            {children}
        </div>
    );
};
export default Wrapper;
